<template>
<div class="app-container">
   
    <!--查询表单-->
       <!--查询表单-->
    <el-form :inline="true" class="demo-form-inline">
        <el-form-item label="添加时间"> 
            <el-date-picker
            v-model="researchQuery.hStart"
            type="datetime"
            placeholder="选择开始时间"
            value-format="yyyy-MM-dd HH:mm:ss"
            default-time="00:00:00"
            />
        </el-form-item>
        <el-form-item>
            <el-date-picker
            v-model="researchQuery.hEnd"
            type="datetime"
            placeholder="选择截止时间"
            value-format="yyyy-MM-dd HH:mm:ss"
            default-time="00:00:00"
            />
        </el-form-item>
        <el-button type="primary" icon="el-icon-search" @click="getList()">查询</el-button>
        <el-button type="default" @click="resetData()">清空</el-button>
    </el-form>
      <!-- 导出excel --> 
      <el-row>
         <el-button size="mini" icon="el-icon-download" type="primary" @click="download"
          >导出表格</el-button
        >
      </el-row>
<!-- 表格 -->
    <el-table
            :data="list"
            stripe
            border
            highlight-current-row>
          <el-table-column v-for="column in tableColumns" :key="column.prop" :prop="column.prop" :label="column.label" :min-width="column.minWidth"/>
    </el-table>
    
</div>
</template>
<script>
import request from "@/utils/request";
import {dataHandler,downloadExcel} from "@/utils/aboutExcel.js"

export default {
    //写核心代码位置
    data(){//定义变量和初始值
        return{   
            researchQuery: {hadmin:""},
            list: null,//查询后返回的集合
            tableColumns:[
                { prop: "util", label: "学院", minWidth: "50" },
                { prop: "discipline", label: "学科", minWidth: "50" },
                { prop: "score1", label: "省部级及以上", minWidth: "50" },
                { prop: "score2", label: "市厅级", minWidth: "50" },
                { prop: "score3", label: "合计", minWidth: "50" }
                ]
        }
    },
    async created(){//页面渲染之前执行，一般执行methods方法
        await this.getList()
        
    },
    methods:{//调用方法
       async getList(){
            console.log(this.researchQuery)
            let userinfo = JSON.parse(sessionStorage.getItem("userInfo"));
            this.researchQuery.hadmin = userinfo.userId
            let data = await request({
                    url:"/excel/showSciAward",
                    method:"post",
                    data:this.researchQuery
                  })
                  this.list = data.data
                  
        },
        resetData(){//清空的方法
            //表单输入项清空
            this.researchQuery={}
            //查所有
            this.getList()
        },
        download(){
            downloadExcel(dataHandler(this.list,this.tableColumns),"科研奖励统计.xlsx")
        }
  
    }

}
</script>